Ext.require([
    'Ext.window.Window',
    'Ext.panel.Panel',
    'Ext.toolbar.*',
    'Ext.tree.Panel',
    'Ext.container.Viewport',
    'Ext.container.ButtonGroup',
    'Ext.form.*',
    'Ext.tab.*',
    'Ext.slider.*',
    'Ext.layout.*',
    'Ext.button.*',
    'Ext.grid.*',
    'Ext.data.*',
    'Ext.util.*',

    'Ext.perf.Monitor'
]);

function getBasicPanel () {
    return {
        xtype: 'panel',
		width: 150,
		height: 90,
		x: 20,
		y: 20,
        title: 'Basic Panel',
        animCollapse: true,
        bodyPadding: 5,
        html: 'Some content'
    };
}

function doThemes () {

    var items = [
        getBasicPanel(),
        0 // end of list (makes commenting out any of the above easy
    ];
    items.pop(); // remove the 0 on the end

	var mainContainer = Ext.create('Ext.container.Container', {
		id: 'main-container',
		width: '100%',
		height: '100%',
		renderTo: document.body,
		layout: 'absolute',
		items: items
	});

}

Ext.onReady(function() {
	Ext.themeName = 'triton';
	doThemes();
});
